<template>
	<view>
		<view class='img'></view>
		<view class="text">
			<view>您还没有点餐</view>
			<view>快去犒劳一下自己吧~</view>
		</view>
		<view class='botton' @click="mini">去点餐</view>
	</view>
</template>

<script setup>
	const mini=()=>{
		uni.redirectTo({
			url: '/pages/menu/menu'
		});
	}
</script>

<style scoped>
	.img{
		width:200px;
		height:200px;
		margin-top: 50px;
		transition:width 3s ;
		animation-delay: 0.2s;
		animation: tu 3s linear infinite;
	}

	@keyframes tu {
		0%{
			background:url(@/images/1.png);
			background-size:200px;
			background-repeat: no-repeat;
			
		}
		60%{
			background:url(@/images/2.png);
			background-size:200px;
			background-repeat: no-repeat;
			
		}
		100%{
			background:url(@/images/3.png);
			background-size:200px;
			background-repeat: no-repeat;
			
		}
	}
	.text{
		width:180px;
		height:50ox;
		text-align: center;
		color:gray;
		margin:20px auto;
	}
	.botton{
		background-color: #8cc540;
		width:180px;
		height:50ox;
		line-height:50px;
		text-align: center;
		border-radius:25px;
		margin:0 auto;
	}
</style>